<template>
	<view class="cu-item shadow" @click="tabClick">
		<view class="title">
			<view class="text-cut">{{ title }}</view>
		</view>
		<view class="content">
			<image :src="imageUrl" mode="aspectFit"></image>
			<view class="desc">
				<view class="text-content">{{ desc }}</view>
				<view class="margin-top-xs">
					<view class="text-gray light sm round fl">{{ time }}</view>
					<view class="text-gray light sm round fr">
						<text class="text-gray cuIcon-mark text-font-size"></text>
						<text>{{ read }}</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	name: 'KCardAticle',
	props: {
		title: {
			type: String,
			default: () => '标题'
		},
		imageUrl: {
			type: String,
			default: () => ''
		},
		desc: {
			type: String,
			default: () => ''
		},
		time: {
			type: String,
			default: () => ''
		},
		read: {
			type: String,
			default: () => ''
		}
	},
	methods: {
		tabClick() {
			this.$emit('tabClick');
		}
	}
};
</script>

<style lang="scss">
// .text-font-size {
// 	font-size: 34rpx;
// }
</style>
